@use './mixins' as *;

// 批注标记样式
.comment-mark {
  position: relative;
  background: transparent;
  border-bottom: 2px solid var(--comment-color, #1890ff);
  cursor: pointer;
  padding-bottom: 2px;
  transition: background 0.2s;

  &:hover {
    background: var(--comment-highlight-bg-start);
  }

  // 批注标记图标（可选）
  &::after {
    content: "💬";
    position: absolute;
    top: -16px;
    right: 0;
    font-size: 12px;
    opacity: 0;
    transition: opacity 0.2s;
  }

  &:hover::after {
    opacity: 1;
  }

  // 已解决的批注样式
  &[data-resolved="true"] {
    opacity: 0.6;
    border-bottom-color: var(--comment-resolved-color, #999);
  }
}

// 活动批注标记
.comment-mark.active {
  background: var(--comment-highlight-bg-start);
  border-bottom-color: var(--comment-active-color, #0050b3);
}

// 高亮样式（用于虚拟列表）- 已移除左边框高亮

// 批注面板滚动条样式
.comment-panel {
  :deep(.virtual-list-container) {
    @include editor-scrollbar();
  }
}

